<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="format-detection" content="telephone=no" />
    <title>代售和代购</title>
    <link rel="stylesheet" href="../../css/reset.css">
    <style>
        body {
            width: 100%;
            background-color: #fff;
            font-size: 0.28rem;
            /* padding-top: 0.5rem; */
            height: auto;
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            font-family: Helvetica;
            color: #333333;
        }

        .shooseBuyorSell {
            width: 100%;
            box-sizing: border-box;
            height: auto;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-around;
            background: #fff;
        }

        .shooseBuyorSell span {
            display: inline-block;
            height: 100%;
            text-align: center;
            line-height: 0.8rem;
            width: 35%;
            border-bottom: 3px solid #fff;
        }

        .shooseBuyorSell span:first-of-type {
            border-bottom-color: #ffd206;
        }

        .buyBox {
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            background-color: #fff;
        }

        .buyBox div {
            padding-left: 0.24rem;
        }

        .buyBox div>p {
            display: inline-block;
            height: 1rem;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
            padding-right: 0.24rem;
        }

        .buyBox div:nth-of-type(2) {
            width: 100%;
            height: 0.88rem;
            box-sizing: border-box;
            font-size: 0.24rem;
            background-color: #f7f7f7;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
        }

        .buyBox div:nth-of-type(2)>p {
            width: 100%;
            border: none;
            display: flex;
            display: -webkit-flex;
            justify-content: space-between;
        }

        .buyBox input {
            text-align: right;
            padding-right: 0.1rem;
            display: inline-block;
            height: 0.8rem;
            border: none;
            outline: none;
            font-size: 0.26rem;
        }

        .buyBox input::-webkit-input-placeholder {
            text-align: right;
            font-size: 0.24rem;
            color: #d9d9d9;
        }

        .sellBox {
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            background-color: #fff;
        }

        .sellBox div {
            /* height: 1.2rem; */
            padding-left: 0.24rem;
        }

        .sellBox div>p {
            display: inline-block;
            height: 1rem;
            border-bottom: 1px solid #e5e5e5;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
            padding-right: 0.24rem;
        }

        .sellBox div:first-of-type>p {
            height: 1.19rem;
            border-bottom: 1px solid #e5e5e5;
        }

        .sellBox div:nth-of-type(2) {
            width: 100%;
            height: 0.88rem;
            box-sizing: border-box;
            font-size: 0.24rem;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
        }

        .sellBox div:nth-of-type(2)>p {
            width: 100%;
            border: none;
            display: flex;
            display: -webkit-flex;
            justify-content: space-between;
        }

        .sellBox input {
            padding-right: 0.1rem;
            display: inline-block;
            padding-left: 0.24rem;
            height: 0.8rem;
            border: none;
            outline: none;
            font-size: 0.26rem;
            flex: 1;
        }

        .sellBox input::-webkit-input-placeholder {
            font-size: 0.24rem;
            color: #d9d9d9;
        }

        #goBuyCoin {
            width: 6.9rem;
            height: 0.9rem;
            text-align: center;
            line-height: 0.9rem;
            background-color: #fad203;
            margin: auto;
            outline: none;
            border: none;
            margin-bottom: 0.5rem;
            border-radius: 0.1rem;
            font-size: 0.28rem;
        }

        #goSellCoin {
            width: 6.9rem;
            height: 0.9rem;
            text-align: center;
            line-height: 0.9rem;
            background-color: #fad203;
            margin: auto;
            outline: none;
            border: none;
            margin-bottom: 0.5rem;
            border-radius: 0.1rem;
            font-size: 0.28rem;
        }

        .showlist {
            background-color: #fff;
        }

        .listtitle {
            width: 100%;
            border-bottom: 1px solid #d9d9d9;
        }

        #showcoinList {
            width: 100%;
            height: auto;
            display: flex;
            display: -webkit-flex;
            justify-content: space-around;
        }

        #showcoinList li {
            padding: 0 0.1rem;
            height: 0.9rem;
            border-bottom: 1px solid #fff;
            line-height: 0.9rem;
        }

        #showcoinList li:first-of-type {
            border-bottom: 1px solid #fad203;
        }

        .listdetail {
            width: 100%;
            height: auto;
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
        }

        .listdetail li {
            width: 100%;
            box-sizing: border-box;
            height: 2.4rem;
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            padding: 0 0.3rem;
            border-bottom: 1px solid #d9d9d9;
        }

        .backchoose {
            height: 0.82rem;
            display: flex;
            display: -webkit-flex;
            justify-content: space-between;
            align-items: center;
        }

        .priceDetail {
            box-sizing: border-box;
            width: 100%;
            display: flex;
            display: -webkit-flex;
            font-size: 0.24rem;
            justify-content: space-between;
            color: #cac5b8;
        }

        .priceDetail div p:not(first-of-type) {
            margin: 0.13rem 0;
        }

        #getSellNumber {
            display: inline-block;
            width: 100%;
            height: 100%;
        }

        .ios-select-widget-box.olay {
            position: fixed;
            z-index: 500;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 1;
            background: rgba(0, 0, 0, 0.75);
        }

        .ios-select-widget-box.olay>div {
            position: fixed;
            z-index: 1000;
            left: 0;
            width: 100%;
            background-color: #fff;
            bottom: 0;
            left: 0;
        }

        .ios-select-widget-box div.iosselect-header {
            height: .88rem;
            line-height: .88rem;
            background-color: #eee;
            width: 100%;
            z-index: 9999;
            text-align: center;
        }

        .ios-select-widget-box div.iosselect-header a {
            font-size: .32rem;
            color: #e94643;
            text-decoration: none;
        }

        .ios-select-widget-box div.iosselect-header a.close {
            float: left;
            padding-left: .3rem;
            height: .88rem;
            line-height: .88rem;
        }

        .ios-select-widget-box div.iosselect-header a.sure {
            float: right;
            padding-right: .3rem;
            height: .88rem;
            line-height: .88rem;
        }

        .ios-select-widget-box {
            padding-top: .88rem;
        }

        .ios-select-widget-box .one-level-contain,
        .ios-select-widget-box .two-level-contain,
        .ios-select-widget-box .three-level-contain {
            height: 100%;
            overflow: hidden;
        }

        .ios-select-widget-box .iosselect-box {
            overflow: hidden;
        }

        .ios-select-widget-box .iosselect-box>div {
            display: block;
            float: left;
        }

        .ios-select-widget-box ul {
            background-color: #fff;
        }

        .ios-select-widget-box ul li {
            font-size: .26rem;
            height: .7rem;
            line-height: .7rem;
            background-color: #fff;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            text-align: center;
            color: #111;
            opacity: .3;
        }

        .ios-select-widget-box ul li.at {
            font-size: .32rem;
            opacity: 1;
        }

        .ios-select-widget-box ul li.side1 {
            font-size: .3rem;
            opacity: .7;
        }

        .ios-select-widget-box ul li.side2 {
            font-size: .28rem;
            opacity: .5;
        }

        .ios-select-widget-box.one-level-box .one-level-contain {
            width: 100%;
        }

        .ios-select-widget-box.one-level-box .two-level-contain,
        .ios-select-widget-box.one-level-box .three-level-contain,
        .ios-select-widget-box.one-level-box .four-level-contain,
        .ios-select-widget-box.one-level-box .five-level-contain,
        .ios-select-widget-box.one-level-box .six-level-contain {
            width: 0;
        }

        .ios-select-widget-box.two-level-box .one-level-contain,
        .ios-select-widget-box.two-level-box .two-level-contain {
            width: 50%;
        }

        .ios-select-widget-box.two-level-box .three-level-contain,
        .ios-select-widget-box.two-level-box .four-level-contain,
        .ios-select-widget-box.two-level-box .five-level-contain,
        .ios-select-widget-box.two-level-box .six-level-contain {
            width: 0;
        }

        .ios-select-widget-box.three-level-box .one-level-contain,
        .ios-select-widget-box.three-level-box .two-level-contain {
            width: 30%;
        }

        .ios-select-widget-box.three-level-box .three-level-contain {
            width: 40%;
        }

        .ios-select-widget-box.three-level-box .four-level-contain .ios-select-widget-box.three-level-box .five-level-contain,
        .ios-select-widget-box.three-level-box .six-level-contain {
            width: 0%;
        }

        .ios-select-widget-box.four-level-box .one-level-contain,
        .ios-select-widget-box.four-level-box .two-level-contain,
        .ios-select-widget-box.four-level-box .three-level-contain,
        .ios-select-widget-box.four-level-box .four-level-contain {
            width: 25%;
        }

        .ios-select-widget-box.four-level-box .five-level-contain,
        .ios-select-widget-box.four-level-box .six-level-contain {
            width: 0%;
        }

        .ios-select-widget-box.five-level-box .one-level-contain,
        .ios-select-widget-box.five-level-box .two-level-contain,
        .ios-select-widget-box.five-level-box .three-level-contain,
        .ios-select-widget-box.five-level-box .four-level-contain,
        .ios-select-widget-box.five-level-box .five-level-contain {
            width: 20%;
        }

        .ios-select-widget-box.five-level-box .six-level-contain {
            width: 0%;
        }

        .ios-select-widget-box .cover-area1 {
            width: 100%;
            border: none;
            border-top: 1px solid #d9d9d9;
            position: absolute;
            top: 2.98rem;
            margin: 0;
            height: 0;
        }

        .ios-select-widget-box .cover-area2 {
            width: 100%;
            border: none;
            border-top: 1px solid #d9d9d9;
            position: absolute;
            top: 3.66rem;
            margin: 0;
            height: 0;
        }

        .ios-select-widget-box #iosSelectTitle {
            margin: 0;
            padding: 0;
            display: inline-block;
            font-size: .32rem;
            font-weight: normal;
            color: #333;
        }

        .bigBox {
            position: relative;
            width: 100%;
            overflow: hidden;
        }

        .slidebox {
            position: relative;
            width: 200%;
            left: 0;
        }

        .slidebox>div {
            width: 50%;
            float: left;
        }

        .ishide {
            display: none;
        }

        .needShow {
            display: block;
        }

        .checkSt {
            float: right !important;
        }

        .ios-select-widget-box.olay {
            top: 0.9rem;
        }

        .ios-select-widget-box.olay>div {
            top: 0.9rem;
        }
    </style>
</head>

<body>
    <div style="width:100%;height: 0.2rem;background-color: #f5f5f5;">

    </div>
    <div class="bigBox">
        <div class="sellBox">
            <div>
                <p>
                    <span class="priceMyBlance">
                        余额(OTC)
                    </span>
                    <span class="myCoinSell">
                        0.00 BCNY
                    </span>
                </p>
            </div>
            <b style="margin-top: 0.5rem;width: 100%;margin-left: 0.24rem;box-sizing: border-box;">
                兑换数量
            </b>
            <div
                style="height:0.8rem;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;">
                <span
                    style="flex:1;height:100%;display:flex;justify-content: space-between;align-items: center;padding-right: 0.2rem;border-bottom: 1px solid #e5e5e5;">
                    <input type="text" name="" id="getSellNumber" placeholder="请输入数量"
                        onkeyup="this.value=this.value.replace(/[^\d\.]/g, '')"
                        style="padding-left:0;flex:1;height: 80%;">
                    <span class="chooseType" style="color:#b9b9b9">
                        CNY
                    </span>
                </span>
            </div>
            <div>
                <p
                    style="height:0.8rem;width:100%;display:flex;justify-content: space-between;align-items: flex-start;padding-top: 0.1rem;border: none;color: #FFD203;">
                    <span class="showChangeoOther">

                    </span>
                </p>
            </div>
            <p style="padding-left:0.24rem;margin:0 0 0.5rem 0;display: flex;display:-webkit-flex;align-items: center;">
                <span
                    style="display: flex;display: -webkit-flex;width: 100%;justify-content: space-between;padding-right: 0.2rem;">
                    <span>
                        需付金额
                    </span>
                    <span class="getBack" style="color:#F95858;margin-left:0.15rem;padding-top: 0.05rem;">
                        0.00 BCNY
                    </span>
                </span>
            </p>
            <button id="goSellCoin">
                立即兑换
            </button>
        </div>
    </div>
    <div class="sellText"
        style="width:100%;height:auto;font-size: 0.22rem;padding: 0.2rem 0.24rem;color: rgba(18, 18, 18, 0.52);display: flex;flex-direction: column; box-sizing: border-box;">
        温馨提示：<br>
        1.OTC余额与CNY的兑换恒定比例为1:1。<br>
        2.成功兑入的CNY将自动入账【现金余额-CNY余额】。<br>
        <span style="color: #F95858;">
            3.人人矿场与2019年12月1日停止OTC余额购买矿机，账户中的OTC余额可兑换成CNY购买矿机。
        </span>
        4.OTC余额的具体兑换规则及使用等最终解释权归人人矿场所有<br>
    </div>
    <script src="../../script/autosize.js"></script>
    <script src="../../script/fastclick.js"></script>
    <script src="../../script/jquery_three_two_one.js"></script>
    <script src="../../script/app.js"></script>
    <script src="../../script/iosselect.js"></script>
    <script>
        apiready = function () {
            var app = new APP();
            if (app.ST == "ios") {
                $("input").click(function () {
                    $(this)
                        .focus()
                        .select(); //保险起见，还是加上这句。
                });
            }
            var account = app.getAccount();
            var choose = "agentSell"; //选择代购还是代售 agentBuy 代购 agentSell 代售
            var chooseTyPe;
            var mymoney; //我的余额
            var myBcny;
            var getChoose = "CNY"; //买入下拉框选择
            var getSellCHoose = "CNY"; //卖出下拉框选择
            var exchangeRate = 1; //汇率
            var getChooseMoneyNum; //对应币种的数量;
            var thisCoinExchangeRate = 1;
            var isdataArr; //外币支付方式
            function getCoinPrice() {
                app.specialCoin(account, function (ret) {
                    if (ret.code == 200) {
                        var dataNum = ret.data.lists;
                        mymoney = app.sliceNum(dataNum.CNY, 2);
                        getChooseMoneyNum = app.sliceNum(dataNum.CNY, 2);
                        myBcny = app.sliceNum(dataNum.BCNY, 2);
                        exchangeRate = 1;
                        $(".myCoin").text(app.outputmoney(dataNum.CNY) + " CNY");
                        $(".myCoinSell").text(app.sliceNum(dataNum.BCNY, 2));
                        if (choose == "agentBuy") {
                            $(".needMoney").text("0.00 " + getChoose);
                            if (getChoose == "CNY") {
                                $(".myCoin").text(
                                    (mymoney == 0 ? "0.00" : app.outputmoney(mymoney)) + " CNY"
                                );
                                $(".showChangeoOtherbuy").text("1.00 " + getChoose + " = " + "1 OTC余额");
                                thisCoinExchangeRate = 1;
                                getChooseMoneyNum = mymoney;
                            }
                        } else {
                            $(".getBack").text("0.00 " + " OTC余额");
                            if (getSellCHoose == "CNY") {
                                $(".showChangeoOther").text("1.00 OTC余额" + " = " + "1.00 " + getSellCHoose);
                                thisCoinExchangeRate = 1;
                            }
                        }
                    }
                });
            }
            getCoinPrice();

            function checkNumber(getChoose, getInput, exchangeRate, choose) {
                console.log("getChoose: " + getChoose + " getInput: " + getInput + " exchangeRate: " + exchangeRate + " choose: " + choose)
                var regTwo = /([0-9]+\.[0-9]{2})[0-9]*/;
                if (!getInput && choose == "agentBuy") {
                    $(".needMoney").text("0.00 " + getChoose);
                    return
                }
                if (getChoose == "CNY" && choose == "agentBuy") {
                    $(".needMoney").text(getInput + getChoose);
                    return
                }
                if (getSellCHoose == "CNY" && choose == "agentSell") {
                    $(".getBack").text(getInput + " OTC余额");
                    return
                }
            }
            $("#getBuyNumber").on("input porpertychange", function () {
                var thisVal = $(this).val();
                if (thisVal) {
                    var re = /([0-9]+\.[0-9]{2})[0-9]*/;
                    var textThisNumSell = $("#getBuyNumber")
                        .val()
                        .replace(re, "$1");
                    var textThisTotal = Number(String(app.accDiv(thisVal, thisCoinExchangeRate)).replace(re, "$1"));
                    if (textThisTotal > Number(getChooseMoneyNum)) {
                        $(".balanceNum").show();
                    } else {
                        $(".balanceNum").hide();
                    }
                    $(this).val(textThisNumSell);
                    checkNumber(getChoose, textThisNumSell, thisCoinExchangeRate, choose);
                } else {
                    checkNumber(getChoose, 0, thisCoinExchangeRate, choose);
                    $(".balanceNum").hide();
                }
            });


            $("#getSellNumber").on("input porpertychange", function () {
                var thisVal = $(this).val();
                if (thisVal) {
                    var re = /([0-9]+\.[0-9]{2})[0-9]*/;
                    var textThisNumSell = $("#getSellNumber").val().replace(re, "$1");
                    if (isNaN(textThisNumSell)) return;
                    if (Number(textThisNumSell) > Number(myBcny)) textThisNumSell = myBcny;
                    $(this).val(textThisNumSell);
                    checkNumber(getSellCHoose, textThisNumSell, thisCoinExchangeRate, choose)
                } else {
                    checkNumber(getSellCHoose, 0, thisCoinExchangeRate, choose)
                    $(".bcnyNum").hide();
                }
            });

            $("#goBuyCoin").on("click", function () {
                var getInPutNumber = $("#getBuyNumber").val();
                if (!getInPutNumber) {
                    app.toast("买入数量不能为空");
                    return;
                }
                if (Number(getInPutNumber) < 1) {
                    app.toast("买入数量不能少于1");
                    return;
                }
                var param = {
                    dtype: "dialog1",
                    data: {
                        text: "亲,你确定要购买BCNY吗？",
                        btns: [{
                            name: "再想想",
                            event: "YesBack"
                        },
                        {
                            name: "确定购买",
                            event: "agentBuyBcny"
                        }
                        ]
                    }
                };
                app.dialog(param);
            });
            $("#goSellCoin").on("click", function (params) {
                var getInPutNumberSell = $("#getSellNumber").val();
                if (!getInPutNumberSell) {
                    app.toast("兑换数量不能为空");
                    return;
                }
                if (Number(getInPutNumberSell) < 1) {
                    app.toast("兑换数量不能少于1");
                    return;
                }
                var param = {
                    dtype: "dialog1",
                    data: {
                        text: "亲,你确定要兑换CNY吗？",
                        btns: [{
                            name: "再想想",
                            event: "YesBack"
                        },
                        {
                            name: "确定兑换",
                            event: "agentBuyBcnySell"
                        }
                        ]
                    }
                };
                app.dialog(param);
            });
            //监听代售
            app.listen("agentBuyBcnySell", function (params) {
                var getInPutNumberValSell = $("#getSellNumber").val();
                app.ajaxPro({
                    url: "platform-coin-repurchase/platform-repurchase",
                    values: {
                        token: account.token,
                        currency_code: "BCNY",
                        after_currency_code: "CNY",
                        amount: getInPutNumberValSell
                    },
                    openFlower: true
                }, function (ret) {
                    if (ret.code == 200) {
                        app.toast("兑换成功");
                        $("#getSellNumber,#getBuyNumber").val("");
                        $(".needMoney,.getBack").text("0.00 CNY");
                        getCoinPrice();
                    } else {
                        app.toast(ret.message);
                    }
                })
            });
            $(".shooseBuyorSell span").on("click", function (params) {
                choose = $(this).attr("data-choose");
                $(".olay").remove();
                if (choose == "agentBuy") {
                    $(".slidebox").animate({
                        left: 0
                    }, 150);
                    $(".buyText").show();
                    $(".sellText").hide();
                    bcnySellClick = 0;
                    getCoinPrice();
                } else {
                    choose = "agentBuy";
                    var cointypecontract = {
                        page: "common/headerwin",
                        name: "getcash_headerwin",
                        param: {
                            subpage: "mine/getcash",
                            name: "getcash",
                            title: "提现",
                            goBcny: "goBcny"
                        }
                    };
                    var recoinNumber = JSON.stringify(cointypecontract);
                    app.goPushPage(recoinNumber);
                }
            });

            $(".balanceNum").click(function () {
                app.checkStausOther(function (ret) {
                    if (ret.code == 200) {
                        var thisGoPage = '{"page":"common/headerwin","name":"littlemoneyrecharge_headerwin","param":{"subpage":"extrapage/littlemoneyrecharge","name":"littlemoneyrecharge","title":"充值"}}';
                        app.goPushPage(thisGoPage);
                    } else {
                        var param = {
                            dtype: "dialog42",
                            data: {
                                event: "checkRealName"
                            }
                        };
                        app.dialog(param)
                    }
                })
            });
            app.listen("checkRealName", function () {
                var goCerfition = {
                    page: "common/headerwin",
                    name: "choosecerfertion_headerwin",
                    param: {
                        subpage: "my/choosecerfertiontwo",
                        name: "choosecerfertiontwo",
                        title: "实名校验",
                        goAddMoney: true
                    }
                };
                var recoinNumber = JSON.stringify(goCerfition);
                app.goPushPage(recoinNumber);
            });
            var evens = ["bhpcCountChange", "littlemoney_recharge_success"];
            app.listen(evens, function () {
                getCoinPrice();
            });
            app.headerMap(function (ret) {
                var cointypecontract = {
                    page: "common/headerwin",
                    name: "sellandbuybcnylist_headerwin",
                    title: "兑换记录",
                    param: {
                        subpage: "my/sellandbuybcnylist",
                        name: "sellandbuybcnylist",
                        title: "兑换记录",
                        showBcny: "true",
                        allowEdit: true
                    }
                };
                var recoinNumber = JSON.stringify(cointypecontract);
                app.goPushPage(recoinNumber);
            })
        };
    </script>
</body>

</html>